import React, { Component } from 'react';
import {connect} from 'react-redux';

//用以获取用户信息
class ComA extends Component {
    
    handleClick =() => {
        console.log(this.props);
        this.props.getUsers()
    }

    render() {
        //这里的 this.props 是第29行的内容
        console.log(this.props);
        return (
            <>
                <button onClick={this.handleClick}>点击发送Action，获取用户信息</button>
                <br/>
                用户信息：
                <div>姓名：{this.props.userName}</div>
                <div>年龄：{this.props.age}</div>
            </>
        );
    }
}

// 第一个参数函数方法
const mapStateToProps = (state) => {
    return {...state.user}
}

// 第二个参数函数方法
const mapDispatchToProps = (dispatch) => {
    return {
        getUsers: () => {
            dispatch({
                type: 'get_users'
            })
        }
    }
}

// ComA 既要发送Action也要接收返回的用户信息。所以两个参数都需要用到
export default connect(mapStateToProps, mapDispatchToProps)(ComA);